<template>
	<view class="g-main">
		<view class="g-header f-bc-whilte f-mb7">
			<view class="g-title f-frowceny f-fz15 f-fc-primary f-fw650 f-borb">零售车订单</view>
			<view class="g-header-content f-fz14">
				<view class="f-fc-primary">大众 朗逸 2019款 1.5L 自动舒适版</view>
				<view class="f-fc-grey f-mt13">颜色：4黑色/3白色/2红色/棕色</view>
				<view class="f-fc-grey f-mt13">数量：10台</view>
			</view>
		</view>
		<view class="g-select-view f-bc-whilte">
			<view class="g-title required f-fz15 f-fc-primary f-fw650 f-frowceny">
				<text>仓库</text>
				<text class="f-f1 f-fc-grey f-tar">选择仓库</text>
				<text class="icon-right f-fc-grey f-mlauto"></text>
			</view>
			<view class="g-title required f-fz15 f-fc-primary f-fw650 f-frowceny">
				选择车架号
			</view>
			<view class="g-content f-fz14">
				<checkbox-group name="">
					<label class="u-select-item f-frowceny">
						<text class="f-fc-grey f-mr30">车架号VIA</text>
						<text class="f-fc-primary f-mr30">LSGUL83LXLA080505</text>
						<checkbox :value="1" class="round red"/>
					</label>
				</checkbox-group>
			</view>
		</view>
		<view class="u-submit-btn-view">
			<button class="u-btn-primary f-fz16 f-fc-whilte">确 定</button>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {};
	},
	methods: {}
};
</script>

<style lang="scss" scoped>
.g-main {
	.g-header {
		.g-header-content {
			padding: 30rpx 30rpx 30rpx 54rpx;
		}
	}
	.g-title {
		height: 90rpx;
		padding: 0 30rpx 0 54rpx;
	}
	.g-title.required {
		position: relative;
	}
	.g-title.required::before {
		content: '*';
		display: inline-flex;
		justify-content: center;
		align-items: center;
		margin-right: 15rpx;
		font-size: 24rpx;
		color: $uni-text-color-red;
		position: absolute;
		top: 50%;
		left: 30rpx;
		transform: translateY(-50%);
	}
	.u-select-item {
		height: 104rpx;
		padding: 0 56rpx;
		border-bottom: 1px solid #F5F5F5;
	}
}
</style>
